<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head th:replace="header::head-fragment('ZuKe租客-首页','index')">
</head>
<body>
<header th:replace="header::header-fragment"></header>
<content id="content">
    <nav th:replace="header::nav-fragment"></nav>
    <div id="banner">
        <img src="/mall/image/swiper/bear.jpg" alt="" style="width: 1226px">
        <!--<div class="swiper-container fl">-->
        <!--    <div class="swiper-wrapper">-->
        <!--        &lt;!&ndash; 配置了轮播图则显示后台配置的轮播图 &ndash;&gt;-->
        <!--        <th:block th:unless="${#lists.isEmpty(carousels)}">-->
        <!--            <th:block th:each="carousel : ${carousels}">-->
        <!--                <div class="swiper-slide">-->
        <!--                    <a th:href="@{${carousel.redirectUrl}}">-->
        <!--                        <img th:src="@{${carousel.carouselUrl}}" alt="">-->
        <!--                    </a>-->
        <!--                </div>-->
        <!--            </th:block>-->
        <!--        </th:block>-->
        <!--        &lt;!&ndash; 未配置轮播图则显示默认的三张轮播图 &ndash;&gt;-->
        <!--        <th:block th:if="${#lists.isEmpty(carousels)}">-->
        <!--            <div class="swiper-slide">-->
        <!--                <img src="/mall/image/swiper/banner01.jpg" alt="">-->
        <!--            </div>-->
        <!--            <div class="swiper-slide">-->
        <!--                <img src="/mall/image/swiper/banner02.jpg" alt="">-->
        <!--            </div>-->
        <!--            <div class="swiper-slide">-->
        <!--                <img src="/mall/image/swiper/banner03.jpg" alt="">-->
        <!--            </div>-->
        <!--        </th:block>-->
        <!--    </div>-->
        <!--    <div class="swiper-pagination"></div>-->
        <!--    <div class="swiper-button-prev"></div>-->
        <!--    <div class="swiper-button-next"></div>-->
        <!--</div>-->
    </div>
    <div id="hotText">
        <h2>酒店必住榜</h2>
    </div>
    <div id="sub_banner">
        <!-- 已配置热销酒店则显示配置内容 -->
        <th:block th:unless="${#lists.isEmpty(hotGoodses)}">
            <th:block th:each="hotGoodse : ${hotGoodses}">
                <div class="hot-image">
                    <a th:href="@{'/goods/detail/'+${hotGoodse.goodsId}}">
                        <img th:src="@{${hotGoodse.goodsCoverImg}}" th:alt="${hotGoodse.goodsName}">
                    </a>
                </div>
            </th:block>
        </th:block>
        <!-- 未配置热销酒店则显示默认 -->
        <th:block th:if="${#lists.isEmpty(hotGoodses)}">
            <div class="hot-image">
                <a href="#">
                    <h2>热门推荐榜</h2>
                    <img src="/mall/image/hotel/remen.png" alt="">
                </a>
            </div>
            <div class="hot-image">
                <a href="#">
                    <h2>试睡员推荐榜</h2>
                    <img src="/mall/image/hotel/shishuiyuan.jpg" alt="">
                </a>
            </div>
            <div class="hot-image">
                <a href="##">
                    <h2>必住亲子酒店榜单</h2>
                    <img src="/mall/image/hotel/qinzi.jpg" alt="">
                </a>
            </div>
            <div class="hot-image">
                <a href="##">
                    <h2>必住度假酒店榜单</h2>
                    <img src="/mall/image/hotel/bizhu.jpg" alt="">
                </a>
            </div>
        </th:block>
    </div>

    <div id="flash">
        <h2>精选酒店</h2>
        <ul>
            <!-- 已配置新店则显示配置内容 -->
            <th:block th:unless="${#lists.isEmpty(Goodses)}">
                <th:block th:each="goods : ${Goodses}">
                    <li>
                        <a th:href="@{'/goods/detail/'+${goods.goodsId}}">
                            <img th:src="@{${goods.goodsCoverImg}}" th:alt="${goods.goodsName}">
                            <p class="name" th:text="${goods.goodsName}">GOOD</p>
                            <p class="discount" th:text="${goods.goodsIntro}">GOOD</p>
                            <p class="item_price" th:text="${goods.sellingPrice}">GOOD</p>
                        </a>
                    </li>
                </th:block>
            </th:block>
            <!-- 未配置则显示默认 -->
            <th:block th:if="${#lists.isEmpty(goodses)}">
                <li>
                    <a href="##">
                        <img src="/mall/image/hotel/qingyou.jpg" alt=""/>
                        <p class="name">成都青柚共享酒店</p>
                        <p class="discount">青羊区西玉龙街小福建营巷5号</p>
                        <p class="price">¥ 53元起</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/mall/image/hotel/JW.jpg" alt=""/>
                        <p class="name">成都茂业JW万豪酒店</p>
                        <p class="discount">锦江区东御街19号</p>
                        <p class="price">¥ 818元起</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/mall/image/hotel/juzi.jpg" alt=""/>
                        <p class="name">桔子酒店(成都新都店)</p>
                        <p class="discount">新都区新都街道北街2号1栋4-12层</p>
                        <p class="price">¥ 298元起</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/mall/image/hotel/licheng.jpg" alt=""/>
                        <p class="name">丽橙酒店·逸(成都春熙路天府广场店)</p>
                        <p class="discount">青羊区顺城大街127号嘉好大厦</p>
                        <p class="price">¥ 311元起</p>
                    </a>
                </li>
                <li>
                    <a href="#">
                        <img src="/mall/image/hotel/su8.jpg" alt=""/>
                        <p class="name">速8酒店(成都高新保税区尚华路店)</p>
                        <p class="discount">郫都区高新西区大道尚华路9号(万景峰2期1栋)</p>
                        <p class="price">¥ 157元起</p>
                    </a>
                </li>

            </th:block>
        </ul>
    </div>

    <div id="recommend">
        <h2>为你推荐精选商品</h2>
        <a href="#" class="more">查看更多>></a>
        <ul>
            <!-- 已配置推荐商品则显示配置内容 -->
            <th:block th:unless="${#lists.isEmpty(recommendGoodses)}">
                <th:block th:each="recommendGoods : ${recommendGoodses}">
                    <li>
                        <a th:href="@{'/goods/detail/'+${recommendGoods.goodsId}}">
                            <div class="info discount" th:text="${recommendGoods.tag}">
                                新店入驻
                            </div>
                            <img th:src="@{${recommendGoods.goodsCoverImg}}" th:alt="${recommendGoods.goodsName}">
                            <p class="name" th:text="${recommendGoods.goodsName}">ZUKE</p>
                            <p class="item_price" th:text="${recommendGoods.sellingPrice}">ZUKE</p>
                            <p class="counter">猜你喜欢</p>
                            <div class="comment">
                                <p>酒店精选</p>
                                <p>好物也可以不贵</p>
                            </div>
                        </a>
                    </li>
                </th:block>
            </th:block>
            <!-- 未配置则显示默认 -->
            <th:block th:if="${#lists.isEmpty(recommendGoodses)}">
                <li>
                    <a href="##">
                        <div class="info discount">
                            新品
                        </div>
                        <img src="/mall/image/sub_banner/r1.jpg" alt=""/>
                        <p class="name">华为平板 M6</p>
                        <p class="price">1499元</p>
                        <p class="counter">猜你喜欢</p>
                        <div class="comment">
                            <p>租客精选</p>
                            <p>好物也可以不贵</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="##">
                        <div class="info discount">
                            5折起
                        </div>
                        <img src="/mall/image/sub_banner/r2.jpg" alt=""/>
                        <p class="name">华为平板 M6</p>
                        <p class="price">1499元</p>
                        <p class="counter">猜你喜欢</p>
                        <div class="comment">
                            <p>租客精选</p>
                            <p>好物也可以不贵</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="##">
                        <div class="info discount">
                            新品
                        </div>
                        <img src="/mall/image/sub_banner/r5.jpg" alt=""/>
                        <p class="name">华为平板 M6</p>
                        <p class="price">1499元</p>
                        <p class="counter">猜你喜欢</p>
                        <div class="comment">
                            <p>租客精选</p>
                            <p>好物也可以不贵</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="##">
                        <div class="info discount">
                            官降
                        </div>
                        <img src="/mall/image/sub_banner/m6.jpg" alt=""/>
                        <p class="name">华为平板 M6</p>
                        <p class="price">1499元</p>
                        <p class="counter">猜你喜欢</p>
                        <div class="comment">
                            <p>租客精选</p>
                            <p>好物也可以不贵</p>
                        </div>
                    </a>
                </li>
                <li>
                    <a href="##">
                        <div class="info discount">
                            新品
                        </div>
                        <img src="/mall/image/sub_banner/r6.jpg" alt=""/>
                        <p class="name">华为平板 M6</p>
                        <p class="price">1499元</p>
                        <p class="counter">猜你喜欢</p>
                        <div class="comment">
                            <p>租客精选</p>
                            <p>好物也可以不贵</p>
                        </div>
                    </a>
                </li>
            </th:block>
        </ul>
    </div>
</content>
<div th:replace="footer::footer-fragment"></div>
<!-- jQuery -->
<script th:src="@{/admin/plugins/jquery/jquery.min.js}"></script>
<!-- Bootstrap 4 -->
<script th:src="@{/admin/plugins/bootstrap/js/bootstrap.bundle.min.js}"></script>
<script th:src="@{/mall/js/swiper-bundle.min.js}" type="text/javascript"></script>
<script th:src="@{/admin/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/mall/js/index.js}" type="text/javascript"></script>
<script th:src="@{/mall/js/search.js}" type="text/javascript"></script>
</body>
</html>
